(function () {
    /* 图片手动上传 */
    
    var uploadLoading = null;
    var uploadCount1 = 0, uploadCount2 = 0, uploadCount3 = 0, uploadCount4 = 0;
    var uploadCustomFileList1 = [], uploadCustomFileList2 = [], 
        uploadCustomFileList3 = [], uploadCustomFileList4 = [];
    
    var uploadContainer1 = '#uploadContainer1', uploadContainer2 = '#uploadContainer2', uploadContainer3 = '#uploadContainer3', uploadContainer4 = '#uploadContainer4';
    var preview1 = '#preview1', preview2 = '#preview2', preview3 = '#preview3', preview4 = '#preview4';
    var $uploadbox1 = $('#uploadbox1'), $uploadbox2 = $('#uploadbox2'), $uploadbox3 = $('#uploadbox3'), $uploadbox4 = $('#uploadbox4');

    weui.uploader(uploadContainer1, {
        url: 'http://gateway.bojun.com/test/upload',
        auto: false,
        compress: { width: 800, height: 600, quality: .2 },
        onBeforeQueued: function (files) {
            if (["image/jpg", "image/jpeg", "image/png", "image/gif"].indexOf(this.type) < 0) {
                weui.alert('请上传图片');
                return false;
            }
            if (this.size > 10 * 1024 * 1024) {
                weui.alert('请上传不超过10M的图片');
                return false;
            }
            if (files.length > 1) { // 防止一下子选择过多文件
                weui.alert('最多只能上传5张图片，请重新选择');
                return false;
            }
            if (uploadCount1 + 1 > 1) {
                weui.alert('最多只能上传1张图片');
                return false;
            }
            ++uploadCount1;
        },
        onQueued: function () {
            uploadCustomFileList1.push(this);
            $uploadbox1.hide()
        },
        onBeforeSend: function (data, headers) {
        },
        onSuccess: function (ret) {
        },
        onError: function (err) {
        }
    });

    // 缩略图预览
    document.querySelector(preview1).addEventListener('click', function (e) {
        var target = e.target;
        while (!target.classList.contains('weui-uploader__file') && target) {
            target = target.parentNode;
        }
        if (!target) return;
        var url = target.getAttribute('style') || '';
        var id = target.getAttribute('data-id');
        url = url.replace(/\"/g, '').replace(/\s+/g, "");
        if (url) {
            url = url.match(/url\((.*?)\)/)[1];
        }
        var gallery = weui.gallery(url, {
            onDelete: function () {
                uploadCount1--;
                weui.confirm('确定删除该图片？', function () {
                    var index;
                    console.log(index);
                    for (var i = 0, len = uploadCustomFileList1.length; i < len; ++i) {
                        var file = uploadCustomFileList1[i];
                        console.log('file.id=='+file.id+'===id==='+id);
                        if (file.id == id) {
                            index = i;
                            break;
                        }
                    }
                    
                    //删除数组
                    if(index !== undefined) uploadCustomFileList1.splice(index, 1);
                    
                    $uploadbox1.show()
                    target.remove();
                    gallery.hide();
                });
            }
        });
    });

    weui.uploader(uploadContainer2, {
        url: 'http://gateway.bojun.com/test/upload',
        auto: false,
        compress: { width: 800, height: 600, quality: .2 },
        onBeforeQueued: function (files) {
            if (["image/jpg", "image/jpeg", "image/png", "image/gif"].indexOf(this.type) < 0) {
                weui.alert('请上传图片');
                return false;
            }
            if (this.size > 10 * 1024 * 1024) {
                weui.alert('请上传不超过10M的图片');
                return false;
            }
            if (files.length > 1) { // 防止一下子选择过多文件
                weui.alert('最多只能上传5张图片，请重新选择');
                return false;
            }
            if (uploadCount2 + 1 > 1) {
                weui.alert('最多只能上传1张图片');
                return false;
            }
            ++uploadCount2;
        },
        onQueued: function () {
            uploadCustomFileList2.push(this);
            $uploadbox2.hide()
        },
        onBeforeSend: function (data, headers) {
        },
        onSuccess: function (ret) {
        },
        onError: function (err) {
        }
    });

    // 缩略图预览
    document.querySelector(preview2).addEventListener('click', function (e) {
        var target = e.target;
        while (!target.classList.contains('weui-uploader__file') && target) {
            target = target.parentNode;
        }
        if (!target) return;
        var url = target.getAttribute('style') || '';
        var id = target.getAttribute('data-id');
        url = url.replace(/\"/g, '').replace(/\s+/g, "");
        if (url) {
            url = url.match(/url\((.*?)\)/)[1];
        }
        var gallery = weui.gallery(url, {
            onDelete: function () {
                uploadCount2--;
                weui.confirm('确定删除该图片？', function () {
                    var index;
                    for (var i = 0, len = uploadCustomFileList2.length; i < len; ++i) {
                        var file = uploadCustomFileList2[i];
                        if (file.id == id) {
                            index = i;
                            break;
                        }
                    }
                     //删除数组
                     if(index !== undefined) uploadCustomFileList2.splice(index, 1);

                    $uploadbox2.show()
                    target.remove();
                    gallery.hide();
                });
            }
        });
    });


    weui.uploader(uploadContainer3, {
        url: 'http://gateway.bojun.com/test/upload',
        auto: false,
        compress: { width: 800, height: 600, quality: .2 },
        onBeforeQueued: function (files) {
            if (["image/jpg", "image/jpeg", "image/png", "image/gif"].indexOf(this.type) < 0) {
                weui.alert('请上传图片');
                return false;
            }
            if (this.size > 10 * 1024 * 1024) {
                weui.alert('请上传不超过10M的图片');
                return false;
            }
            if (files.length > 1) { // 防止一下子选择过多文件
                weui.alert('最多只能上传5张图片，请重新选择');
                return false;
            }
            if (uploadCount3 + 1 > 1) {
                weui.alert('最多只能上传1张图片');
                return false;
            }
            ++uploadCount3;
        },
        onQueued: function () {
            uploadCustomFileList3.push(this);
            $uploadbox3.hide()
        },
        onBeforeSend: function (data, headers) {
        },
        onSuccess: function (ret) {
        },
        onError: function (err) {
        }
    });

    // 缩略图预览
    document.querySelector(preview3).addEventListener('click', function (e) {
        var target = e.target;
        while (!target.classList.contains('weui-uploader__file') && target) {
            target = target.parentNode;
        }
        if (!target) return;
        var url = target.getAttribute('style') || '';
        var id = target.getAttribute('data-id');
        url = url.replace(/\"/g, '').replace(/\s+/g, "");
        if (url) {
            url = url.match(/url\((.*?)\)/)[1];
        }
        var gallery = weui.gallery(url, {
            onDelete: function () {
                uploadCount3--;
                weui.confirm('确定删除该图片？', function () {
                    var index;
                    for (var i = 0, len = uploadCustomFileList3.length; i < len; ++i) {
                        var file = uploadCustomFileList3[i];
                        if (file.id == id) {
                            index = i;
                            break;
                        }
                    }
                     //删除数组
                     if(index !== undefined) uploadCustomFileList3.splice(index, 1);

                    $uploadbox3.show()
                    target.remove();
                    gallery.hide();
                });
            }
        });
    });


    weui.uploader(uploadContainer4, {
        url: 'http://gateway.bojun.com/test/upload',
        auto: false,
        compress: { width: 800, height: 600, quality: .2 },
        onBeforeQueued: function (files) {
            if (["image/jpg", "image/jpeg", "image/png", "image/gif"].indexOf(this.type) < 0) {
                weui.alert('请上传图片');
                return false;
            }
            if (this.size > 10 * 1024 * 1024) {
                weui.alert('请上传不超过10M的图片');
                return false;
            }
            if (files.length > 5) { // 防止一下子选择过多文件
                weui.alert('最多只能选择5张图片，请重新选择');
                return false;
            }
            
        },
        onQueued: function () {
            uploadCustomFileList4.push(this);
        },
        onBeforeSend: function (data, headers) {
        },
        onSuccess: function (ret) {
        },
        onError: function (err) {
        }
    });

    // 缩略图预览
    document.querySelector(preview4).addEventListener('click', function (e) {
        var target = e.target;
        while (!target.classList.contains('weui-uploader__file') && target) {
            target = target.parentNode;
        }
        if (!target) return;
        var url = target.getAttribute('style') || '';
        var id = target.getAttribute('data-id');
        url = url.replace(/\"/g, '').replace(/\s+/g, "");
        if (url) {
            url = url.match(/url\((.*?)\)/)[1];
        }
        var gallery = weui.gallery(url, {
            onDelete: function () {
                weui.confirm('确定删除该图片？', function () {
                    var index;
                    for (var i = 0, len = uploadCustomFileList4.length; i < len; ++i) {
                        var file = uploadCustomFileList4[i];
                        if (file.id == id) {
                            index = i;
                            break;
                        }
                    }
                     //删除数组
                     if(index !== undefined) uploadCustomFileList4.splice(index, 1);

                    target.remove();
                    gallery.hide();
                });
            }
        });
    });


    function upload() {
        //移除上传按钮绑定的点击事件
        document.getElementById("uploaderCustomBtn").removeEventListener('click', upload, false);

        var uploadFilesAll = [...uploadCustomFileList1, ...uploadCustomFileList2, ...uploadCustomFileList3, ...uploadCustomFileList4] ;

        // uploadCustomFileList1.forEach(function (file) {
        //     uploadFilesAll.push(file)
        // });
        // uploadCustomFileList2.forEach(function (file) {
        //     uploadFilesAll.push(file)
        // });
        // uploadCustomFileList3.forEach(function (file) {
        //     uploadFilesAll.push(file)
        // });
        // uploadCustomFileList4.forEach(function (file) {
        //     uploadFilesAll.push(file)
        // });

        if(uploadFilesAll.length > 0) {
            console.log('---------------------------------');
            uploadLoading = weui.loading('上传中请稍等');
            var index = 0 ;
            uploadFilesAll.forEach(function (file) {
                console.log(file);
                index++
                file.upload();

                if(index === uploadFilesAll.length) {
                    uploadLoading.hide();
                    document.getElementById("uploaderCustomBtn").addEventListener('click', upload);
                    weui.toast('上传成功', 1000);
                }
            });
        } else {
            weui.topTips('请选择图片', 1000);
            document.getElementById("uploaderCustomBtn").addEventListener('click', upload);
        }
        
    }

    // 手动上传按钮
    document.getElementById("uploaderCustomBtn").addEventListener('click', upload);
})();